$(document).ready(function() {
	$('#singleUser').show();
	$.when(getAllUsers()).done(fillPage);
});

var fillPage = function() {
	$.each(users, function(i, item) {
		fillOneUserItem(i, item);
	});
	window.reload();
};

var fillOneUserItem = function(i, item) {
	var counter = i + 1;
	var userdataContainer = document.getElementById('userdata');
	
	var tRow = document.createElement('tr');
	var tData = document.createElement('td');
	tData.innerHTML = item.nickname;
	
	tRow.appendChild(tData);
	userdataContainer.appendChild(tRow);
	
	//onclicks after everything is appended
	tData.onclick = handleUserClick;
	/*
	 * -------------------
	 * What it looks like:
	 * -------------------
	 * 
	 * 	<tr>
       		<td onclick="testClick()">TestNICKNAME</td>
    	</tr>
	 */
};

var handleUserClick = function() {
	getOneUser(this.innerHTML);
	
}